{% extends "base.html" %}

{% block content %}
    <div id="root">
        <div class="app-body-main">
            <div class="app-main-box">
                {% include "_app_header.html" with class="manager-header home-header-transparent-white" %}

                <div class="ant-spin-nested-loading">
                    <div class="ant-spin-container">
                        <div class="app-main-content tt">

                            <div class="management-homepage">
                                <div class="layout-normal">
                                    <div>
                                        <div class="left-box">
                                            <div class="info-module">
                                                <section class="module-header"><span class="module-title">账号信息</span>
                                                    <a href="{% url 'user_profile' %}"
                                                       class="module-click"><span>查看</span><span>&gt;</span></a>
                                                </section>
                                                <div class="avator-box"><img
                                                        src="/static/images/oauth/oauth_logo.jpg">
                                                    <h2>{{ request.user.username }}</h2><span class="label"></span><span
                                                            class="name"
                                                            style="width: 100px;">{{ company_name }}</span>
                                                </div>
                                                <div class="icon-box"><img
                                                        src=""
                                                        alt="">{% if user_reg_type == 0 %}个人开发者{% else %}企业开发者{% endif %}
                                                </div>
                                            </div>
                                        </div>
                                        <div class="right-box">
                                            <div style="margin-top: 0px;">
                                                <div class="module-your-app" style="height: auto;">
                                                    <div class="app-detail">
                                                        <div class="title-container">
                                                            <h3>应用列表</h3>
                                                            <div>
                                                                <div class="">授权地址: {{request.scheme}}://{{request.META.HTTP_HOST}}{% url 'oauth2_provider:authorize' %}</div>
                                                                <div class="">获取token地址: {{request.scheme}}://{{request.META.HTTP_HOST}}{% url 'oauth2_get_token' %}</div>
                                                                <div class="">刷新token地址: {{request.scheme}}://{{request.META.HTTP_HOST}}{% url 'oauth2_get_token' %}</div>
                                                            </div>
                                                        </div>
                                                        <div class="control-container">
                                                            <div>应用状态&nbsp;&nbsp;&nbsp;<div
                                                                    class="ant-select ant-select-enabled"
                                                                    style="width: 130px;">
                                                                <div class="ant-select-selection
            ant-select-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true"
                                                                     aria-expanded="false" tabindex="0">
                                                                    <div class="ant-select-selection__rendered">
                                                                        <div class="ant-select-selection-selected-value"
                                                                             title="全部"
                                                                             style="display: block; opacity: 1;">全部
                                                                        </div>
                                                                    </div>
                                                                    <span class="ant-select-arrow" unselectable="on"
                                                                          style="user-select: none;"><i
                                                                            class="anticon anticon-down ant-select-arrow-icon"><svg
                                                                            viewBox="64 64 896 896" class=""
                                                                            data-icon="down" width="1em" height="1em"
                                                                            fill="currentColor" aria-hidden="true"
                                                                            focusable="false"><path
                                                                            d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
                                                                </div>
                                                            </div>
                                                            </div>
                                                            <button type="button" class="ant-btn app-new-xm-btn-normal">
                                                                <a href="{% url 'management_create' %}">创建应用</a></button>
                                                        </div>
                                                        <div class="ant-table-wrapper app-detail-table"
                                                             style="margin-bottom: 30px;">
                                                            <div class="ant-spin-nested-loading">
                                                                <div class="ant-spin-container">
                                                                    <div class="ant-table ant-table-default ant-table-empty ant-table-scroll-position-left">
                                                                        <div class="ant-table-content">
                                                                            <div class="ant-table-body">
                                                                                <table class="">
                                                                                    <colgroup>
                                                                                        <col style="width: 230px; min-width: 230px;">
                                                                                        <col style="width: 180px; min-width: 180px;">
                                                                                        <col style="width: 160px; min-width: 160px;">
                                                                                        <col style="width: 140px; min-width: 140px;">
                                                                                        <col style="width: 100px; min-width: 100px;">
                                                                                        <col style="width: 100px; min-width: 100px;">
                                                                                    </colgroup>
                                                                                    <thead class="ant-table-thead">
                                                                                    <tr>
                                                                                        <th class="">
                                                                                            <div>应用名称</div>
                                                                                        </th>
                                                                                        <th class="break-the-word ant-table-align-left"
                                                                                            style="text-align: left;">
                                                                                            <div>APP ID</div>
                                                                                        </th>
                                                                                        <th class="break-the-word ant-table-align-left"
                                                                                            style="text-align: left;">
                                                                                            <div>创建时间</div>
                                                                                        </th>
                                                                                        <th class="ant-table-align-center"
                                                                                            style="text-align: center;">
                                                                                            <div>应用状态</div>
                                                                                        </th>
                                                                                        <th class="ant-table-align-center"
                                                                                            style="text-align: center;">
                                                                                            <div>操作</div>
                                                                                        </th>
                                                                                    </tr>
                                                                                    </thead>
                                                                                    <tbody class="ant-table-tbody">
                                                                                        {% for application in applications %}
                                                                                            <tr class="ant-table-row ant-table-row-level-0"
                                                                                            data-row-key="0">
                                                                                            <td><span
                                                                                                    class="ant-table-row-indent indent-level-0"></span>
                                                                                                <p class="app-name"><img
                                                                                                        class="pic"
                                                                                                        src="/static/images/accounts/partner_app.png"
                                                                                                        alt=""><span
                                                                                                        class="text">{{ application.name }}</span>
                                                                                                </p>
                                                                                            </td>
                                                                                            <td class="break-the-word" style="text-align: left;">
                                                                                                {{ application.client_id }}
                                                                                            </td>
                                                                                            <td class="break-the-word" style="text-align: left;">
                                                                                                {{ application.created }}
                                                                                            </td>
                                                                                            <td style="text-align: center;">
                                                                                                <span class="table-app-status table-app-status-3">使用中</span>
                                                                                            </td>
                                                                                            <td style="text-align: center;">
                                                                                                <div>
                                                                                                    <a href="{% url 'management_detail' application.id %}">应用信息</a>
                                                                                                    <a style="color: #215fff;" href="{% url "management_update" application.id %}">编辑</a>
                                                                                                    <a style="color: #fc5832;" href="{% url "management_delete" application.id %}">删除</a>
                                                                                                </div>
                                                                                            </td>
                                                                                        </tr>
                                                                                        {% endfor %}
                                                                                    </tbody>
                                                                                </table>
                                                                            </div>
                                                                            {% if applications is None %}<div class="ant-table-placeholder">暂无数据</div>{% endif %}
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
{% endblock %}